<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="minimum-scale=1.0, width=device-width, maximum-scale=1.0, user-scalable=no"/>
    <meta charset="utf-8">
    <script src="https://unpkg.com/redux@3.7.2/dist/redux.min.js"></script>
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
    <title>Redux</title>
</head>
<body>
<div id="react-container"></div>
  <script type="text/babel">

    const { createStore } = Redux

    const color = (state = {}, action) => {
      switch (action.type) {
          case "ADD_COLOR":
              return {
                  id: action.id,
                  title: action.title,
                  color: action.color,
                  timestamp: action.timestamp,
                  rating: 0
              }
          case "RATE_COLOR":
              return (state.id !== action.id) ?
                  state :
                  {
                      ...state,
                      rating: action.rating
                  }
          default :
              return state
      }
    }

    const store = createStore(color)

    console.log(store.getState())

  </script>
</body>
</html>
